
<div class="modal-over" ng-controller="LoginFormController" ng-init="app.settings.container = false;"
	style="background: url(images/login-background2.jpg) center center; background-size: cover">
	<div style=" width: 100%;margin: auto;position: absolute;top: 50%; left: 50%;-webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); ">
		<div class="navbar-brand block">
			<div class="thumb-lg m-t-lg text-info" style="width: 100%;">
				<span><img src="images/icons-2-2.png" style="max-width: 300px; max-height: 100px;" title="{{'header.navbar.app' | translate}}"></span>
			</div>
		</div>

		<div class="panel panel-default container w-xxl w-auto-xs">
			<div class="panel-heading font-bold text-center" style="background-color: transparent;">
				<span class="font-bold" translate="user.logintip">Plese enter your account to login the system</span>
			</div>
			<div class="panel-body">
				<form name="form" class="form-validation">
					<div class="text-danger text-center m-b" ng-show="authError">{{authError}}</div>
					<div class="list-group list-group-sm">
						<div class="input-group m-b">
							<input type="input" placeholder="{{ (selectLang == 'English') ? 'Username' : '用户名' }}"
								class="form-control" ng-model="user.username" required>
							<span class="input-group-addon"><i class="fa fa-user text-muted"></i></span>
						</div>
						<div class="input-group m-b">
							<input type="password" placeholder="{{ (selectLang == 'English') ? 'Password' : '用户密码' }}"
								class="form-control" ng-model="user.password" required>
							<span class="input-group-addon"><i class="fa fa-lock text-muted"></i></span>
						</div>

						<div class="input-group m-b" ng-if="needVerifyCode">
							<input type="input" placeholder="{{ (selectLang == 'English') ? 'Verify code' : '验证码' }}"
								class="form-control fa fa-chevron-left" style="width: 35%;"
								ng-model="user.verifyCode" required />
							<div class="pull-right label m-t-sm">
								<a ng-click="refreshVerifyCode()"><span class="font-bold"
									translate="user.changeone">Change one</span></a>
							</div>
							<div class="pull-right label verify-hover">
								<img ng-src="{{ user.verifyCodeUrl }}"  ng-click="refreshVerifyCode()" alt="{{ 'user.changeone' | translate }}">
							</div>
						</div>

						<div class="checkbox ">
							<label class="i-checks i-checks-sm"> 
								<input type="checkbox" ng-model="user.rememberme"><i></i> <span translate="user.rememberme" style="margin-left:1px;"></span>
							</label>
						</div>
					</div>

					<button type="submit" class="btn btn-lg btn-info btn-block" ng-click="login()" ng-disabled='form.$invalid'>
						<span class="font-bold" translate="user.login" ng-show="visible">Log in</span> 
						<span class="font-bold" translate="user.logging" ng-hide="visible">Being logged in system</span>
					</button>
					<div class="btn-group btn-group-justified">
						<a ui-sref="access.signup" class="btn" style="background-color:#8cca98; color:#FFF"><span class="font-bold" translate="user.signup">Signup</span></a>
						<a ui-sref="access.forgotpwd" class="btn" style="background-color:#ec7d6e; color:#FFF"><span class="font-bold" translate="user.forgotpassword">Forgot password?</span></a>
					</div>
				</form>
			</div>
		</div>
		<div class="text-center" ng-include="'views/blocks/footer.html'"></div>
		<div class="text-center">
			<span ng-repeat="(langKey, label) in langs">
                [<a ng-click="setLang(langKey, $event)" href>{{label}}</a>]
            </span>
		</div>
	</div>

	<div class="toast-bottom-full-width"
		style="background-color:#88C4FF; padding: 10px; position: absolute; bottom: 0; left: 0; width: 100%;" ng-if="hasNewVersion">
		<div class="text-center"> 
			<span class="ng-binding ng-scope">
			<a href="{{apkurl}}"><span translate="common.newVersionApk">New Version APK </span></a></span>
		</div>
	</div>

</div>